﻿@model e_commerce.Foreground.Models.Order

@{
    ViewBag.Title = "订单详情";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<section class="order-detail-wrap">
    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
        <legend>订单详情</legend>
    </fieldset>
    <div class="order-detail-state">
        <input type="hidden" value="@Model.StateBar" id="order_state" />
        <span class="order-state-01">提交订单</span>

        <span class="order-state-02">买家付款</span>

        <span class="order-state-03">发货中</span>

        <span class="order-state-04">交易完成</span>
    </div>
    <div class="order">
        <div class="order-message-top">
            <span style="color:#bdbdbd;">订单号 : </span><span class="order-id">@Model.OrderId</span>
        </div>
        <div class="order-table-head">
            <span class="w50">商品名</span>
            <span class="w125">单价</span>
            <span class="w125">数量</span>
            <span class="w125">小计</span>
            <span class="w125">状态</span>
        </div>
        <div class="order-message">
            <div class="goods-name w50">
                <img style="height:80px;width:80px;" src="@Model.Icon" />
                <span>@Model.GoodsName</span>
            </div>
            <div class="order-price w125">￥<span>@Model.Price</span></div>
            <div class="goods-count w125">@Model.Count</div>
            <div id="price" class="order-price w125"></div>
            <div class="order-state w125">@Model.State</div>
        </div>
        <div class="order-bill">
            <div>
                <span>总金额</span>
                <span class="total-amount"></span>
            </div>
            <div style="border-bottom:1px solid #f3f3f3;">
                <span>运费</span>
                <span class="carriage">￥0</span>
            </div>
            <div style="margin-top:30px;">
                <span>应付</span>
                <span class="cope"></span>
            </div>
        </div>
        <div class="order-mark">
            <div class="consignee-message">
                <h1>收货人信息</h1>
                <div class="consignee-name">
                    <span>收货人:</span>
                    <span>@Model.DeliverName</span>
                </div>
                <div class="deliver">
                    <span>地址:</span>
                    <span>@Model.Deliver</span>
                </div>
                <div class="phone-number">
                    <span>电话:</span>
                    <span>@Model.PhoneNumber</span>
                </div>
            </div>
            <div class="mark">
                <h1>订单备注</h1>
                <div class="client-mark">
                    <span>买家备注:</span>&nbsp;&nbsp;<span>@Model.ClientMark</span>
                </div>
                <div class="service-mark">
                    <span>客服备注:</span>&nbsp;&nbsp;<span>@Model.ServerMark</span>
                </div>
            </div>
        </div>
    </div>
</section>

@section Styles{
    <link href="~/CSS/order-detail.css" rel="stylesheet" />
}

@section Scripts{
    <script src="~/JS/OrderDetail.js"></script>
}